<j:tbuttons 
  [editState]="editState"
  (saveBtnClick)="save()"
  (giveupBtnClick)="giveup()"
  (newBtnClick)="new()"
  (deleteBtnClick)="delete()"
  (searchBtnClick)="search($event)"
  [newBtnDisabledFn]="isNewButtonDisabledFn"
></j:tbuttons>
<div nz-row class="main-layout">
  <div nz-col nzSpan="6" class="main-layout-left">
    <nz-card class="main-card">
      <nz-tabset nzType="card">
        <nz-tab [nzTitle]="'BasicArchives::UI:SimplyTree.CardTitle.Directory' | abpLocalization">
          <nz-tree-view 
            [nzTreeControl]="treeControl"
            [nzDataSource]="dataSource"
            [nzDirectoryTree]="true"
            [trackBy]="trackBy"
          >
            <nz-tree-node *nzTreeNodeDef="let node" nzTreeNodePadding>
              <nz-tree-node-toggle nzTreeNodeNoopToggle></nz-tree-node-toggle>
              <nz-tree-node-option
                [nzSelected]="selectListSelection.isSelected(node)"
                (nzClick)="selectNode(node)"
                (contextmenu)="contextMenu($event, menuLeaf, node)"
              >
                {{ node.name }}
                <nz-dropdown-menu #menuLeaf="nzDropdownMenu">
                  <ul nz-menu>
                    <li nz-menu-item *ngIf="node.parentId != null" (click)="refAddModal(node.parentId)">{{ 'BasicArchives::UI:SimplyTree.ContextMenu.SameLevel' | abpLocalization }}</li>
                    <li nz-menu-item (click)="refAddModal(node.id)">{{ 'BasicArchives::UI:SimplyTree.ContextMenu.Children' | abpLocalization }}</li>
                  </ul>
                </nz-dropdown-menu>
              </nz-tree-node-option>
            </nz-tree-node>

            <nz-tree-node *nzTreeNodeDef="let node; when: hasChild" nzTreeNodePadding>
              <nz-tree-node-toggle>
                <i
                  nz-icon
                  nzType="caret-down"
                  nzTreeNodeToggleRotateIcon
                  (nzClick)="toggleExpand(node)"
                ></i>
              </nz-tree-node-toggle>              
              <nz-tree-node-option
                [nzSelected]="selectListSelection.isSelected(node)"
                (nzClick)="selectNode(node)"
                (dblclick)="toggleExpand(node)"
                (contextmenu)="contextMenu($event, menuNode, node)"
              >
                {{ node.name }}
                <nz-dropdown-menu #menuNode="nzDropdownMenu">
                  <ul nz-menu>
                    <li nz-menu-item *ngIf="node.parentId != null" (click)="refAddModal(node.parentId)">{{ 'BasicArchives::UI:SimplyTree.ContextMenu.SameLevel' | abpLocalization }}</li>
                    <li nz-menu-item (click)="refAddModal(node.id)">{{ 'BasicArchives::UI:SimplyTree.ContextMenu.Children' | abpLocalization }}</li>
                  </ul>
                </nz-dropdown-menu>
              </nz-tree-node-option>
            </nz-tree-node>
          </nz-tree-view>
        </nz-tab>
      </nz-tabset>
    </nz-card>
  </div>  
  <div nz-col nzSpan="18" class="main-layout-right">
    <nz-card class="main-card">
      <form nz-form [formGroup]="validateForm">
        <nz-tabset nzType="card">
          <nz-tab [nzTitle]="'BasicArchives::UI:SimplyTree.CardTitle.Base' | abpLocalization">
            <div nz-row>
              <div nz-col [nzSpan]="12">
                <nz-form-item>
                  <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="displayName">
                    {{ 'BasicArchives::ModelTitle:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.DisplayName' | abpLocalization }}
                  </nz-form-label>
                  <nz-form-control [nzSm]="16" [nzXs]="24" nzHasFeedback [nzErrorTip]="errorTpl">
                    <input
                      nz-input
                      id="displayName"
                      formControlName="displayName"
                      [placeholder]="'BasicArchives::ModelPlaceHolder:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.DisplayName' | abpLocalization"
                    />
                  </nz-form-control>
                </nz-form-item>
              </div>
              <div nz-col [nzSpan]="12"></div>
              <div nz-col [nzSpan]="12">
                <nz-form-item>
                  <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="version">
                    {{ 'BasicArchives::ModelTitle:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.Version' | abpLocalization }}
                  </nz-form-label>
                  <nz-form-control [nzSm]="16" [nzXs]="24" nzHasFeedback [nzErrorTip]="errorTpl">
                    <input
                      nz-input
                      id="version"
                      formControlName="version"
                      [placeholder]="'BasicArchives::ModelPlaceHolder:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.Version' | abpLocalization"
                    />
                  </nz-form-control>
                </nz-form-item>
              </div>
              <div nz-col [nzSpan]="12"></div>
              <div nz-col [nzSpan]="12">
                <nz-form-item>
                  <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="itemMasterId">
                    {{ 'BasicArchives::ModelTitle:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.ItemMasterId' | abpLocalization }}
                  </nz-form-label>
                  <nz-form-control [nzSm]="16" [nzXs]="24" nzHasFeedback [nzErrorTip]="errorTpl">
                    <widget-entity-ref-select                    
                      id="itemMasterId"
                      formControlName="itemMasterId" 
                      [placeholder]="'BasicArchives::ModelPlaceHolder:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.ItemMasterId' | abpLocalization"
                      [idKey]="'id'"
                      [labelKey]="'name'"
                      [showSelect]="showItemMasterSelect"
                      [getDetail]="getItemMasterDetail"
                      (selectedValueChanged)="onItemMasterSelect($event)"
                      readonly
                    >
                    </widget-entity-ref-select>
                  </nz-form-control>
                </nz-form-item>
              </div>
              <div nz-col [nzSpan]="12"></div>
              <div nz-col [nzSpan]="12">
                <nz-form-item>
                  <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="itemCode">
                    {{ 'BasicArchives::ModelTitle:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.ItemCode' | abpLocalization }}
                  </nz-form-label>
                  <nz-form-control [nzSm]="16" [nzXs]="24" nzHasFeedback [nzErrorTip]="errorTpl">
                    <input
                      nz-input
                      id="itemCode"
                      formControlName="itemCode"
                      [placeholder]="'BasicArchives::ModelPlaceHolder:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.ItemCode' | abpLocalization"
                    />
                  </nz-form-control>
                </nz-form-item>
              </div>
              <div nz-col [nzSpan]="12"></div>
              <div nz-col [nzSpan]="12">
                <nz-form-item>
                  <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="itemName">
                    {{ 'BasicArchives::ModelTitle:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.ItemName' | abpLocalization }}
                  </nz-form-label>
                  <nz-form-control [nzSm]="16" [nzXs]="24" nzHasFeedback [nzErrorTip]="errorTpl">
                    <input
                      nz-input
                      id="itemName"
                      formControlName="itemName"
                      [placeholder]="'BasicArchives::ModelPlaceHolder:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.ItemName' | abpLocalization"
                    />
                  </nz-form-control>
                </nz-form-item>
              </div>
              <div nz-col [nzSpan]="12"></div>
              <div nz-col [nzSpan]="12">
                <nz-form-item>
                  <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="itemSpec">
                    {{ 'BasicArchives::ModelTitle:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.ItemSpec' | abpLocalization }}
                  </nz-form-label>
                  <nz-form-control [nzSm]="16" [nzXs]="24" nzHasFeedback [nzErrorTip]="errorTpl">
                    <input
                      nz-input
                      id="itemSpec"
                      formControlName="itemSpec"
                      [placeholder]="'BasicArchives::ModelPlaceHolder:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.ItemSpec' | abpLocalization"
                    />
                  </nz-form-control>
                </nz-form-item>
              </div>
              <div nz-col [nzSpan]="12"></div>
              <div nz-col [nzSpan]="12">
                <nz-form-item>
                  <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="useCount">
                    {{ 'BasicArchives::ModelTitle:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.UseCount' | abpLocalization }}
                  </nz-form-label>
                  <nz-form-control [nzSm]="16" [nzXs]="24" nzHasFeedback [nzErrorTip]="errorTpl">
                    <nz-input-number
                      id="useCount"
                      formControlName="useCount"       
                      [nzPlaceHolder]="'BasicArchives::ModelPlaceHolder:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.UseCount' | abpLocalization"
                      [nzMin]="0"
                      [nzPrecision]="4"
                      style="width: 100%;">
                    </nz-input-number>
                  </nz-form-control>
                </nz-form-item>
              </div>
              <div nz-col [nzSpan]="12"></div>
              <div nz-col [nzSpan]="12">
                <nz-form-item>
                  <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="parentCount">
                    {{ 'BasicArchives::ModelTitle:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.ParentCount' | abpLocalization }}
                  </nz-form-label>
                  <nz-form-control [nzSm]="16" [nzXs]="24" nzHasFeedback [nzErrorTip]="errorTpl">
                    <nz-input-number
                      id="parentCount"
                      formControlName="parentCount"       
                      [nzPlaceHolder]="'BasicArchives::ModelPlaceHolder:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.ParentCount' | abpLocalization"
                      [nzMin]="0"
                      [nzPrecision]="4"
                      style="width: 100%;">
                    </nz-input-number>
                  </nz-form-control>
                </nz-form-item>
              </div>
              <div nz-col [nzSpan]="12"></div>
              <div nz-col [nzSpan]="12">
                <nz-form-item>
                  <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="unitId">
                    {{ 'BasicArchives::ModelTitle:Joy.Erp.BasicArchives.ItemMasters.BillOfMaterials.UnitId' | abpLocalization }}
                  </nz-form-label>
                  <nz-form-control [nzSm]="16" [nzXs]="24" nzHasFeedback [nzErrorTip]="errorTpl">
                    <widget-entity-ref-select
                      id="unitId"
                      formControlName="unitId" 
                      [placeholder]="'BasicArchives::ModelPlaceHolder:Joy.Erp.BasicArchives.Asns.AsnLine.UnitId' | abpLocalization"
                      [idKey]="'id'"
                      [labelKey]="'unit.displayName'"
                      [showSelect]="getShowUnitSelect"
                      [getDetail]="getUnitDetail"
                    >
                    </widget-entity-ref-select>
                  </nz-form-control>
                </nz-form-item>
              </div>
              <div nz-col [nzSpan]="12"></div>
            </div>
          </nz-tab>
        </nz-tabset>
      </form>

      <ng-template #errorTpl let-control>
        <ng-container *ngIf="control.hasError('required')">
          {{ 'BasicArchives::UI:Validation:Required' | abpLocalization }}
        </ng-container>
        <ng-container *ngIf="control.hasError('maxlength')">
          {{ 'BasicArchives::UI:Validation:MaxLength' | abpLocalization: control.getError('maxlength').requiredLength }}
        </ng-container>
      </ng-template>

    </nz-card>
  </div>
</div>